import React from 'react';
import { Row, Col, Form, InputNumber, Input, Button, Table, Select, Modal,Popconfirm, message} from 'antd';
const R = require('ramda');
import BizParams from '../../../components/commons/BizParams'
import Validator from '../../../utils/Validator'

const FormItem = Form.Item;
const view= "view"

export default Form.create({wrappedComponentRef: true})(class AddLinkman extends React.Component {
	constructor(props) {
		super(props);
        this.state = {
            open: false,
            disabled: true,
            type: "",
        }
	}

    handleCancel = () => {
        // this.props.form.setFieldsValue({name: "", telephone: "", mobile: "", email: "", sex: "", position: ""});
        this.props.form.resetFields()
        this.setState({open:false})
        this.props.dispatch({
            type: 'customerManage/setlinkman',
            payload: {
                linkman: "",
            }
        });
    }

    handleOpen = (type) => {
        this.state.type = type;
        this.setState({open: true})
    }

    handleConfirm = () => {
        this.props.form.validateFields((errors, values) => {
            let dataSource = R.isNil(this.props.dataSource) ? {} : this.props.dataSource
            if (errors) return;

            if(this.state.type == view){
                return;
            }

            let linkman = values;
            let type = "";
            if (this.state.type == "add") {
                type = "customerManage/addLinkman";

            } else if (this.state.type == "edit") {
                type = "customerManage/updateLinkman";

            }else{
                type = "orderManage/createLinkman";
            }

            linkman.id  = R.isNil(this.props.dataSource) ? "" : this.props.dataSource.id;
            linkman.cstid = this.props.cstId;
            this.props.dispatch({
                type: type,
                payload: {
                    linkman: linkman,
                    onSuccess:()=>{
                        this.handleCancel();
                    }
                }
            })


        })
    }

	render() {

		const { getFieldDecorator } = this.props.form;
        const formItemLayout = {labelCol: { xs: {span: 8}, sm: {span: 8}}, wrapperCol: {xs: {span: 15}, sm: {span: 14}}};
        let dataSource = R.isNil(this.props.dataSource) ? {} : this.props.dataSource;

        let footer=[
            <Popconfirm onConfirm={this.handleConfirm.bind(this, true)} cancelText="否" okText="是"
                        placement="leftTop" title={'为了保持存量数据的一致性，联系人新增之后不能修改只能，请确认！'}>
                <Button key="ok" size="large">确定</Button>
            </Popconfirm>,
            <Button key="cancel" size="large" onClick={this.handleCancel.bind(this, true)}>取消</Button>
        ];

        return (
            <Modal visible={this.state.open} title={"添加联系人"} width={700} wrapClassName="vertical-center-modal"
                onCancel={this.handleCancel} footer={footer} >
                <Form>

                    <Row>
                        <Col span={12}>
                            <FormItem {...formItemLayout} label="姓名" hasFeedback>
                                {getFieldDecorator('name', {
                                    rules: [{
                                        required: true, message: '请输入姓名'
                                    }],
                                    initialValue: dataSource.name
                                })(
                                    <Input maxLength="20" disabled={this.props.disabled || this.state.type == view}/>
                                )}
                            </FormItem>
                        </Col>
                        <Col span={12}>
                            <FormItem {...formItemLayout} label="性别" hasFeedback>
                                {getFieldDecorator('sex', {
                                    rules: [{
                                        required: true, message: '请选择性别'
                                    }],
                                    initialValue: R.isNil(dataSource.sex) ? undefined : dataSource.sex+""
                                })(
                                    <BizParams sprCode='sex' disabled={this.props.disabled || this.state.type == view}/>
                                )}
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span={12}>
                            <FormItem
                                {...formItemLayout}
                                label="手机"
                                hasFeedback
                            >
                                {getFieldDecorator('mobile', {
                                    rules: [
                                        {required: true, message: '请输入手机号！'},
                                        {pattern:Validator.mobile,message:'请输入正确的手机号'},
                                    ],
                                    initialValue: dataSource.mobile,

                                })(
                                    <Input maxLength="20" disabled={this.props.disabled || this.state.type == view}/>
                                )}
                            </FormItem></Col>
                            <Col span={12}>
                             <FormItem
                                {...formItemLayout}
                                label="邮箱"
                                hasFeedback
                            >
                                {getFieldDecorator('email', {
                                    rules: [
                                        {required: true, message: '请输入邮箱!'},
                                        {type:'email',message:'请填写正确的邮箱'},
                                    ],
                                    initialValue: dataSource.email
                                })(
                                    <Input maxLength="30" disabled={this.props.disabled || this.state.type == view}/>
                                )}
                            </FormItem></Col>
                    </Row>
                    <Row>
                        <Col span={12}>
                            <FormItem
                                {...formItemLayout}
                                label="电话"
                                hasFeedback
                            >
                                {getFieldDecorator('telephone', {
                                    rules: [
                                        {required: false, message: '请输入电话！'},
                                        {pattern:Validator.phone,message:'请输入正确的电话'},
                                    ],
                                    initialValue: dataSource.telephone
                                })(
                                    <Input maxLength="20" disabled={this.props.disabled || this.state.type == view}/>
                                )}
                            </FormItem>
                        </Col>
                        <Col span={12}>
                            <FormItem {...formItemLayout} label="职位" hasFeedback>
                                {getFieldDecorator('position', {
                                    initialValue: dataSource.position
                                })(
                                    <Input maxLength="20" disabled={this.props.disabled || this.state.type == view}/>
                                )}
                            </FormItem></Col>
                    </Row>
                </Form>
            </Modal>
        );
	}
})


// WEBPACK FOOTER //
// ./public/src/components/order/components/AddLinkman.js
